A Fero le gusta el menú de Everything is a Remix un menú sencillo según sus palabras, y nos pregunta si hay forma de tener uno igual. Para añadirlo editamos un nuevo gadget de HTML y en su interior añadimos:
<div id="mainNav">
<ul>
<li class="page_item page-item-30 current_page_item"><a href="#" title="Inicio">Inicio</a></li>
<li class="page_item page-item"><a href="#" title="Perfil">Perfil</a></li>
<li class="page_item page-item-12"><a href="#" title="Contacto">Contacto</a></li>
<li class="page_item page-item-11"><a href="#" title="Blogger">Blogger</a></li>
<li><a href="#">RSS</a></li>
</ul>
</div>

Y antes de ]]></b:skin>  añadimos los estilos:

#mainNav{
margin-top: 10px;
padding: 5px;
background: #FBFBFB;
border-top: 1px solid #EAEAEA;
border-bottom: 1px solid #EAEAEA;
}
#mainNav ul{
margin: 0 auto;
width: 60em;
text-align: left
}
#mainNav li{
display: inline;
margin-right: 20px;
font-size: 1.5em;
text-transform: uppercase;
}
#mainNav li:last-child{
margin-right: 0;
}
#mainNav a:link,
#mainNav a:visited{
color: #999;
white-space: nowrap;
}
#mainNav a:hover,
#mainNav a:active{
text-decoration: underline;
color: #2E301C;
}
#mainNav .current_page_parent a:link,
#mainNav .current_page_parent a:visited,
#mainNav .current_page_item a:link,
#mainNav .current_page_item a:visited{
font-weight: bold;
color: #2A2D1A;
}
#mainNav .current_page_parent a:hover,
#mainNav .current_page_parent a:active,
#mainNav .current_page_item a:hover,
#mainNav .current_page_item a:active{
color: #2E301C;
}

Para configurar un menú esta entrada puede ser de utilidad.
Anónimo

Hola Gema!!! muchísimas gracias!!! :)

Estoy editando a partir de la plantilla mínima un nuevo blog donde me quiero reconciliar con el arte, y voy a colgar mis trabajos; allí voy a colocar el menú...

Pero aún tengo un pequeño detalle en el menú y no logro encontrar que hice mal al colocarlo:
El fondo gris alrededor del menú no me aparece, ni las líneas...

Que será? Mira como queda: http://feromenoi.blogspot.com

Gracias gema, de nuevo.

Responder
Gem@

:: Los estilos están incompletos Fero, debe ser al copiar que muchas veces se queda algo en el aire ;)

Responder
Anónimo

Gema, he probado en un blog de pruebas y si me sale el menú... mi plantilla tiene algo que lo impide... creo que me toca romperme la cabeza para para lograr colocarlo... :O
Gracias por tu ayuda!
;)

Responder
Gem@

:: Elimina eso que has comentado de <!-- Menu --> y el de Fin menú.
Cuando comentes en los estilos prueba de esta forma esta forma :
/* ---------- Menu ---------- */

Responder
Anónimo

Siii Gema, tienes toda la razón!!! ha funcionado! Ahora a editar los enlaces y la cabecera para que quede como quiero! muchas gracias Gema!
Entrar aquí es aprender.

Feliz día! ;)

Responder
Anónimo

Oh Gema... solo tengo una pregunta más... :$
Cuando cambio el tamaño de las letras, para ponerlas un poco más pequeñas, el menú deja de estar centrado. Como hago para que quede en el centro?

http://feromenoi.blogspot.com

Gracias y disculpame tantas preguntas :$

Responder
Gem@

:: Ve jugando con el padding que hay en mainNav por
ejemplo verás que dice padding: 5px sustituye eso por padding: 5px 80px 5px; y vemos si queda centrado.

Te dejo un enlace para que veas como jugar con el padding y el margin:
http://gemablog-.blogspot.com/2009/12/las-propidades-margin-y-padding.html

Responder
Anónimo

Así quedó perfecto Gema! Muchas gracias!! He aprendido mucho, gracias por tu tiempo y talento! :)

Responder
EpideMia

ya lo estoy usando!!!!
MUY BUENO GEMA ;)

Responder
Gem@

:: Me alegra esté solucionado Fero :D

:: EpideMia ya lo ví!! :)

Responder
Anónimo

hola gem@! cómo puedo hacer este mismo menú en VERTICAL?
gracias!

Responder

Los comentarios han sido inhabilitados temporalmente. ¡GRACIAS!

:):'(:(:P:D:$;):-I:X:O|O:S

Nota: solo los miembros de este blog pueden publicar comentarios.

 


top